<!DOCTYPE html>
<html lang="zh">

<head>
	<link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
	<link href="../vendor/bootstrap/css/bootstrap-table.min.css" rel="stylesheet">
	<link href="../vendor/bootstrap/css/bootstrap-datepicker.min.css" rel="stylesheet">
	<link rel="icon" href="../img/icon-128.png">
	<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>QQ空间导出助手</title>
</head>

<body>
	<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
		<a class="navbar-brand" href="#">QQ空间导出助手</a>
		<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
			<span class="navbar-toggler-icon"></span>
		</button>
		<div class="collapse navbar-collapse" id="navbarSupportedContent">
			<ul class="navbar-nav mr-auto">
				<li class="nav-item">
					<a class="nav-link active" href="home.html">个人中心<span class="sr-only">(current)</span></a>
				</li>
				<li class="nav-item">
					<a id="setting-link" class="nav-link" href="options.html">设置</a>
				</li>
				<li class="nav-item">
					<a id="about-link" class="nav-link" href="about.html">关于</a>
				</li>
			</ul>
			<span id="qzone_title" class="navbar-text" style="color: skyblue;"></span>
		</div>
	</nav>
	<div class="row">
		<div class="col-md-1">
			<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical" style="text-align: center;">
				<a class="nav-item nav-link active" id="v-pills-messages-tab" data-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-selected="true">说说</a>
				<a class="nav-item nav-link" id="v-pills-blogs-tab" data-toggle="pill" href="#v-pills-blogs" role="tab" aria-controls="v-pills-blogs" aria-selected="false">日志</a>
				<a class="nav-item nav-link" id="v-pills-diaries-tab" data-toggle="pill" href="#v-pills-diaries" role="tab" aria-controls="v-pills-diaries" aria-selected="false">私密日志</a>
				<a class="nav-item nav-link" id="v-pills-photos-tab" data-toggle="pill" href="#v-pills-photos" role="tab" aria-controls="v-pills-photos" aria-selected="false">相册</a>
				<a class="nav-item nav-link" id="v-pills-videos-tab" data-toggle="pill" href="#v-pills-videos" role="tab" aria-controls="v-pills-videos" aria-selected="false">视频</a>
				<a class="nav-item nav-link" id="v-pills-boards-tab" data-toggle="pill" href="#v-pills-boards" role="tab" aria-controls="v-pills-boards" aria-selected="false">留言板</a>
				<a class="nav-item nav-link" id="v-pills-friends-tab" data-toggle="pill" href="#v-pills-friends" role="tab" aria-controls="v-pills-friends" aria-selected="false">好友</a>
				<a class="nav-item nav-link" id="v-pills-favorites-tab" data-toggle="pill" href="#v-pills-favorites" role="tab" aria-controls="v-pills-favorites" aria-selected="false">收藏夹</a>
			</div>
		</div>
		<div class="col">
			<div class="tab-content" id="v-pills-tabContent">
				<div class="tab-pane fade show active" id="v-pills-messages" role="tabpanel" aria-labelledby="v-pills-messages-tab">
					<div id="messages-table-toolbar">
						<button id="messages-export" class="btn btn-primary">导出</button>
					</div>
					<table id="messages-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-blogs" role="tabpanel" aria-labelledby="v-pills-blogs-tab">
					<div id="blogs-table-toolbar">
						<button id="blogs-export" class="btn btn-primary">导出</button>
					</div>
					<table id="blogs-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-diaries" role="tabpanel" aria-labelledby="v-pills-diaries-tab">
					<div id="diaries-table-toolbar">
						<button id="diaries-export" class="btn btn-primary">导出</button>
					</div>
					<table id="diaries-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-photos" role="tabpanel" aria-labelledby="v-pills-photos-tab">
					<div id="photos-table-toolbar">
						<button id="photos-export" class="btn btn-primary">导出</button>
					</div>
					<table id="photos-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-videos" role="tabpanel" aria-labelledby="v-pills-videos-tab">
					<div id="videos-table-toolbar">
						<button id="videos-export" class="btn btn-primary">导出</button>
					</div>
					<table id="videos-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-boards" role="tabpanel" aria-labelledby="v-pills-boards-tab">
					<div id="boards-table-toolbar">
						<button id="boards-export" class="btn btn-primary">导出</button>
					</div>
					<table id="boards-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-friends" role="tabpanel" aria-labelledby="v-pills-friends-tab">
					<div id="friends-table-toolbar">
						<button id="friends-export" class="btn btn-primary">导出</button>
					</div>
					<table id="friends-table"></table>
				</div>
				<div class="tab-pane fade" id="v-pills-favorites" role="tabpanel" aria-labelledby="v-pills-favorites-tab">
					<div id="favorites-table-toolbar">
						<button id="favorites-export" class="btn btn-primary">导出</button>
					</div>
					<table id="favorites-table"></table>
				</div>
			</div>
		</div>
	</div>
	<script src="../vendor/thunder/thunder-link.js"></script>
	<script src="../vendor/jquery/jquery-3.3.1.min.js"></script>
	<script src="../vendor/popper/popper.min.js"></script>
	<script src="../vendor/tableExport/tableExport.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap-table.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap-table-zh-CN.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap-datepicker.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap-datepicker.zh-CN.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap-table-filter-control.min.js"></script>
	<script src="../vendor/bootstrap/js/bootstrap-table-export.min.js"></script>
	<script src="../js/config.js"></script>
	<script src="../js/utils.js"></script>
	<script src="../js/api.js"></script>
	<script src="../js/options.js"></script>
</body>

</html>